<template>
  <van-nav-bar
    left-text="返回"
    left-arrow
    @click-left="$router.back()"
    title="修改性别"
    placeholder
    fixed
  >
    <template #right>
      <van-button text type="primary" size="small" @click="onSubmit">保存</van-button>
    </template>
  </van-nav-bar>
  <van-form @submit="onSubmit">
    <van-cell-group >
      <!-- 性别 -->
      <van-field name="gender" label="性别">
        <template #input>
          <van-radio-group v-model="newGender" direction="horizontal">
            <van-radio name="男">男</van-radio>
            <van-radio name="女">女</van-radio>
          </van-radio-group>
        </template>
      </van-field>
    </van-cell-group>
  </van-form>
</template>

<script setup>
import { ref } from 'vue'
import { getUserInfoReq, userModifyReq } from '@/api/user'

let userInfo = ref({})
// 获取用户信息
function getUserInfo() {
  getUserInfoReq().then((res) => {
    // console.log(res.data.data)
    userInfo.value = res.data.data
    newGender.value = res.data.data.gender
  })
}
getUserInfo()
// 修改性别
let newGender = ref('')
function onSubmit() {
  // console.log(newGender.value);

  userModifyReq(
    userInfo.value.birthday,
    userInfo.value.age,
    userInfo.value.value,
    userInfo.value.area,
    userInfo.value.address,
    userInfo.value.value,
    newGender.value,
  ).then((res) => {
    if (res.data.code === 1) {
      // eslint-disable-next-line no-undef
      showSuccessToast('修改成功')
      getUserInfo()
    } else {
      // eslint-disable-next-line no-undef
      showFailToast('修改失败')
    }
  })
}
</script>

<style scoped></style>
